<template>
    <div class="code-box flex-align-center-col">
        <div class="code-content">
            <div class="code-content-text" v-html="obj.article.aContent">
            </div>
        </div>
    </div>
</template>

<script>
    import {reactive} from "@vue/reactivity";
    import service from "@/assets/js/service";
    import {onMounted} from "@vue/runtime-core";
    import {goTop} from "@/assets/js/utils";
    export default {
        name: "Code",
        setup(){
            let obj=reactive({
                article:{}
            })

            async function initArticle(){
                const data=await  service.getCodeArticle()
                if(data.code===200){
                    obj.article=data.data
                }
            }

            onMounted(()=>{
                initArticle()
                goTop()
            })
            return{
                obj
            }
        }
    }
</script>

<style scoped lang="less">
    .code-box{
        width: 100%;
        min-height: 2200px;
        background-color: var(--theme-color);
        padding-top: 100px;
        .code-content{
            width: 80%;
            height: 90%;
            display: flex;
            justify-content: center;


            .code-content-text{
                margin-top: 100px;
                width: 80%;
                min-height: 800px;
                color: white;

            }
        }
    }
</style>